loginDialog: Only highlight a single item at any time

The user list uses the same indication for hover and focus, so it
is possible for two items to be highlighted at the same time. Using
different styling would improve the situation, but only to some
extent - the user would still need to figure out which highlight
corresponds to which activation method. So instead, copy the
approach we use in popup menus and use a single property for
highlights that is updated by both focus- and hover changes.

https://bugzilla.gnome.org/show_bug.cgi?id=772284

diff --git a/data/theme/gnome-shell-high-contrast.css b/data/theme/gnome-shell-high-contrast.css
index e973db160dcafdb90107f7703f2089b51c79e094..a388ef0413c6d77d39203d738e39f12a510ae5a1 100644 (file)
--- a/data/theme/gnome-shell-high-contrast.css
+++ b/data/theme/gnome-shell-high-contrast.css
@@ -1724,7 +1724,7 @@ StScrollBar {
   spacing: 12px;
   padding: .2em;
   width: 23em; }
-  .login-dialog-user-list:expanded .login-dialog-user-list-item:focus {
+  .login-dialog-user-list:expanded .login-dialog-user-list-item:selected {
     background-color: #215d9c;
     color: #ffffff; }
   .login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
@@ -1738,9 +1738,6 @@ StScrollBar {
     padding-right: 1em; }
   .login-dialog-user-list-item:rtl {
     padding-left: 1em; }
-  .login-dialog-user-list-item:hover {
-    background-color: #215d9c;
-    color: #ffffff; }
   .login-dialog-user-list-item .login-dialog-timed-login-indicator {
     height: 2px;
     margin: 2px 0 0 0;

diff --git a/data/theme/gnome-shell-sass b/data/theme/gnome-shell-sass
index 2bef9b25e23632fe66e12c5d96a9c487f172a6a0..4de529843779532db8e5aa76b4e8a74f163e79c5 160000 (submodule)
--- a/data/theme/gnome-shell-sass
+++ b/data/theme/gnome-shell-sass
@@ -1 +1 @@
-Subproject commit 2bef9b25e23632fe66e12c5d96a9c487f172a6a0
+Subproject commit 4de529843779532db8e5aa76b4e8a74f163e79c5

diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index c9396a2698d19eeb2226c2c04b2a81329143b195..6f9f2013236c8c5075614f1cb7266a5ab8a0157f 100644 (file)
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -1724,7 +1724,7 @@ StScrollBar {
   spacing: 12px;
   padding: .2em;
   width: 23em; }
-  .login-dialog-user-list:expanded .login-dialog-user-list-item:focus {
+  .login-dialog-user-list:expanded .login-dialog-user-list-item:selected {
     background-color: #215d9c;
     color: #ffffff; }
   .login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
@@ -1738,9 +1738,6 @@ StScrollBar {
     padding-right: 1em; }
   .login-dialog-user-list-item:rtl {
     padding-left: 1em; }
-  .login-dialog-user-list-item:hover {
-    background-color: #215d9c;
-    color: #ffffff; }
   .login-dialog-user-list-item .login-dialog-timed-login-indicator {
     height: 2px;
     margin: 2px 0 0 0;

diff --git a/js/gdm/loginDialog.js b/js/gdm/loginDialog.js
index 5055a0a58ac65bd59561dea03f4c8fab154e38f1..49cab564767c953fcc37bba16055b63023fd81af 100644 (file)
--- a/js/gdm/loginDialog.js
+++ b/js/gdm/loginDialog.js
@@ -70,6 +70,16 @@ const UserListItem = new Lang.Class({
         this.actor.connect('destroy',
                            Lang.bind(this, this._onDestroy));
 
+        this.actor.connect('key-focus-in', () => {
+            this._setSelected(true);
+        });
+        this.actor.connect('key-focus-out', () => {
+            this._setSelected(false);
+        });
+        this.actor.connect('notify::hover', () => {
+            this._setSelected(this.actor.hover);
+        });
+
         this._userWidget = new UserWidget.UserWidget(this.user);
         layout.add(this._userWidget.actor);
 
@@ -103,6 +113,15 @@ const UserListItem = new Lang.Class({
         this.emit('activate');
     },
 
+    _setSelected: function(selected) {
+        if (selected) {
+            this.actor.add_style_pseudo_class('selected');
+            this.actor.grab_key_focus();
+        } else {
+            this.actor.remove_style_pseudo_class('selected');
+        }
+    },
+
     showTimedLoginIndicator: function(time) {
         let hold = new Batch.Hold();